<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
 <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
 <%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link href="${pageContext.request.contextPath}/css/baStyle.css" rel="stylesheet" type="text/css" />
<!-- <link href="${pageContext.request.contextPath}/css/select.css" rel="stylesheet" type="text/css" /> -->
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.idTabs.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/select-ui.min.js"></script>
<%-- <script type="text/javascript" src="${pageContext.request.contextPath}/editor/kindeditor.js"></script> --%>
<script src="${pageContext.request.contextPath}/js/jquery.form.js"></script><!--表单异步 -->
<script type="text/javascript" src="${pageContext.request.contextPath}/js/baPublicJs.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery.shCircleLoader.js" type="text/javascript"></script>
  
<style type="text/css">
.box div[id] {width:100px; height:100px; margin:10px auto;}
.box{position:absolute;width:600px;left:50%;height:auto;z-index:100;padding:1px;}
#bg{background-color:#666;position:absolute;z-index:99;left:0;top:0;display:none;width:100%;height:100%;opacity:0.5;filter: alpha(opacity=50);-moz-opacity: 0.5;}
</style>  
<script type="text/javascript">
$(document).ready(function(e) {
	//给翻页指定页数样式
	  $(".paginList a").each(function () {
	     if("javascript:;"==$(this).attr("href")){
	    	 $(this).parent("li").addClass("current");
	     }
	  });
	$('#typeNameEdit .tab').click(function(){
		  if(!$(this).is('.input')){
			  var oldname=$(this).text();
			  var typeMode=$(this).attr("value");
	          $(this).addClass('input').html('<input type="text" style="width:95%;height:34px;" value="'+ $(this).text() +'" />').find('input').focus().blur(function(){
	              /* var thisid = $(this).parent().siblings("th:eq(0)").text(); */
	              var thisid = $(this).parent().parent().find("#hiddenTypeId").val();//获取改行数据的id
	              var linkType = $(this).parent().parent().find("#linktypeid").text();//获取类型
					if(""==linkType || null==linkType){
						linkType=oldname;
		              }
	              var thisvalue=$(this).val();
	             /*  var thisclass = $(this).parent().attr("class");   */
	              $.ajax({
	                type: 'POST',
	                url: '${pageContext.request.contextPath}/baSkip/updateTyTa.do',
	                data: "thisid="+thisid+"&part=type&thisvalue="+thisvalue+"&typeMode="+typeMode,
	                success: function(data){ //回调方法
	                	if('1'==data){
    						/* alert("修改成功！"); */
    						location="${pageContext.request.contextPath}/baSkip/botFourLink/botFourLinkType.do?type=3";
    					}if('0'==data){
    						alert("修改失败！");
    						location="${pageContext.request.contextPath}/baSkip/botFourLink/botFourLinkType.do?type=3";
    					}
    					if('100'==data){
    						alert("类型编码不能有中文！");
    						location="${pageContext.request.contextPath}/baSkip/botFourLink/botFourLinkType.do?type=3";
    					}
	    			}
	              });
	              
	              $(this).parent().removeClass('input').html($(this).val() || 0);
	          });                    
	      }
    }).hover(function(){
        $(this).addClass('hover');
    },function(){
        $(this).removeClass('hover');
    });
	 /*复选框全选和全不选js*/
	  $("#checkeds").click(function(){
	      //下面的是用js的方式实现效果也是一样的 
	        for(var i=0;i<$("#showTable :checkbox").length;i++){
	         $("#showTable :checkbox")[i].checked=!$("#showTable :checkbox")[i].checked;
	         }
	  });
	
	 
	$('#tableNameEdit .tab').click(function(){
		  if(!$(this).is('.input')){
			  var typeMode=$(this).attr("value");
	          $(this).addClass('input').html('<input type="text" style="width:90%;height:55px;" value="'+ $(this).text() +'" />').find('input').focus().blur(function(){
	             /*  var thisid = $(this).parent().siblings("th:eq(0)").text(); */
	              var thisid = $(this).parent().parent().find("#hiddenTableId").val();//获取改行数据的id
	              var linkType = $(this).parent().parent().find("#linktableid").text();//获取类型
	              var thisvalue=$(this).val();
	              /* var thisclass = $(this).parent().attr("class");  */ 
	           
	              $.ajax({
	                type: 'POST',
	                url: '${pageContext.request.contextPath}/baSkip/updateTyTa.do',
	                data: "thisid="+thisid+"&part=table&thisvalue="+thisvalue+"&typeMode="+typeMode,
	                success: function(data){ //回调方法
	                	if('1'==data){
    						/* alert("修改成功！"); */
    						locationUrl="${pageContext.request.contextPath}/baSkip/botFourLink/botFourLinkTable.do?type=3&typeData="+linkType;
    					}else{
    						alert("修改失败！");
    						location="${pageContext.request.contextPath}/baSkip/botFourLink/botFourLinkType.do?type=3";
    					}	
	    			}
	              });
	              $(this).parent().removeClass('input').html($(this).val() || 0);
	          });                    
	      }
    }).hover(function(){
        $(this).addClass('hover');
    },function(){
        $(this).removeClass('hover');
    });
	 /*复选框全选和全不选js*/
	  $("#checkedTwo").click(function(){
	      //下面的是用js的方式实现效果也是一样的 
	        for(var i=0;i<$("#showTableTwo :checkbox").length;i++){
	         $("#showTableTwo :checkbox")[i].checked=!$("#showTableTwo :checkbox")[i].checked;
	         }
	  });
	 /* 数据类和类型数据切换的触发事件 */
	//类型触发事件
	  $('#typeClick').click(function(){
		  location="${pageContext.request.contextPath}/baSkip/botFourLink/botFourLinkType.do?type=3";
	  });
	  //类型数据触发事件
     $('#tableClick').click(function(){
		   location="${pageContext.request.contextPath}/baSkip/botFourLink/botFourLinkTable.do?type=3";
	  }); 
	 
});
//删除单条信息
function delectOne(id,linkType,temp){
	var url="";data={};locationUrl="";
	if("type"==temp){
		url="${pageContext.request.contextPath}/baSkip/delectTypeOne.do";
		data={"id":id,"linkType":linkType};
		locationUrl="${pageContext.request.contextPath}/baSkip/botFourLink/botFourLinkType.do?type=3";
	}else{
		url="${pageContext.request.contextPath}/baSkip/delectTableOne.do";
		data={"id":id};
		locationUrl="${pageContext.request.contextPath}/baSkip/botFourLink/botFourLinkTable.do?type=3&typeData="+linkType;
	}
	pubDelectOne(url,data,locationUrl,temp);
}
function pubDelectOne(url,data,locationUrl,temp){
	var r=confirm("确定该条数据！");
	if (r==true){
		$.ajax({
			type:"post", //提交的类型
			url:url,//提交地址
			data: data,
			dataType: 'text',
			success: function(data){ //回调方法
				if("type"==temp){
					if('100'!=data){
						alert("删除成功！");
						location=locationUrl;
					}else{
						alert("删除失败！");
					}
				}else{
					if('1'==data){
						alert("删除成功！");
						location=locationUrl;
					}else{
						alert("删除失败！");
					}
				}
			}
			});
	  }	
} 


//批量删除
function delectAll(temp,tableId,typeData){
	var url="";locationUrl="";
	if("type"==temp){
		url="${pageContext.request.contextPath}/baSkip/delectAllType.do";
		locationUrl="${pageContext.request.contextPath}/baSkip/botFourLink/botFourLinkType.do?type=3";
	}else{
		url="${pageContext.request.contextPath}/baSkip/delectAllTable.do";
		locationUrl="${pageContext.request.contextPath}/baSkip/botFourLink/botFourLinkTable.do?type=3&typeData="+typeData;
	}
	publicDelectAll(url,locationUrl,tableId);
}

function publicDelectAll(url,locationUrl,tableId){
	var sum="";
	for(var i=0;i<$("#"+tableId+" :checkbox").length;i++){
		if($("#"+tableId+" :checkbox")[i].checked){
			var checkVal=$("#"+tableId+" :checkbox")[i].value;
			if(""==sum){
				sum+=checkVal;
			}else{
				sum+=","+checkVal;
			}
		}
     }
	if(""!=sum){
	 var r=confirm("确定删除！");
	   if (r==true){
		 $.ajax({
			type:"post", //提交的类型
			url:url,//提交地址
			data: {
				"sum":sum
				 },
			dataType: 'text',
			success: function(data){ //回调方法
				if('succeed'==data){
					alert("删除成功！");
					location=locationUrl;
				}else{
					alert("删除失败！");
				}
			}
		 });
	   }
	}else{
		alert("请选择至少一条要删除的数据！");
	}
}

/*编辑的下拉框选择  */
function gradeChange(){
    var options=$("#tableSelect option:selected");  //获取选中的项
    location="${pageContext.request.contextPath}/baSkip/botFourLink/botFourLinkTable.do?type=3&typeData="+options.val();
  /*   $("#selectColour").val(options.val());//如果重新选择了就将改值存入 */
   }
   
/*刷新页面*/
function refreshLookTy(returnUrl,typename){
	location="${pageContext.request.contextPath}/baSkip/botFourLink/"+returnUrl+".do?type=3&typeData="+typename;
}  
 /*生成模板页面  */
 function creatFtl(id){
	//调用遮罩层
	 shade();
	 $.ajax({
         type: 'post',
         url: '${pageContext.request.contextPath}/baSkip/FtlLookFour.do',
         success: function(data){ //回调方法
          	if('success'==data){
          	//点击关闭按钮的时候，遮罩层关闭
				$("#bg,.box").css("display", "none");
          		alert("模板创建成功！");
 					locationUrl="${pageContext.request.contextPath}/botFourLink/botFourLinkTable.do?type=3&typeData="+id;
 				}else{
 					alert("模板创建失败！");
 				}	
 			}
       });
 }
 
 /**
  *修改图片
  */
 function submitFourUpload(id,fileName){
	  	//ajax参数
		     	var option = {
		     		url:"${pageContext.request.contextPath}/upload/uploadFourPic.do",
		     		type:"post",
		     		dataType:"text",
		     		data:{
		     			fileName:fileName,
		     			type:"upd",
		     			id:id
		     		},
		     		success:function(responseText){
		     			//把字符串解析成json对象
		         		var obj = $.parseJSON(responseText);
		         		 $("#showTableTwo tr").each(function(){
		         			   var d=$(this).find("td:eq(1) input").val();
		         			   if(d==id){
		         				  $(this).find("td:eq(3) img").attr("src",obj.path); 
		         				  $(this).find("td:eq(5)").text(obj.relativePath); 
		         			   }
		         			});
		     		},
		     		error:function(){
		     			alert("系统错误");
		     		}
		     	};
		     	//表单的异步提交，需要jquery.form.js支持
		     	$("#addFourTabFrom").ajaxSubmit(option);
 }
</script>
</head>

<body>
	<div class="place">
	    <span>位置：</span>
	    <ul class="placeul">
		    <li><a href="#">首页</a></li>
		    <li><a href="#">链接类型操作</a></li>
	    </ul>
    </div>
    <div class="formbody">
	    <div id="usual1" class="usual"> 
		    <div class="itab">
			  	<ul> 
			  	<c:if test="${botPopLink=='botFourLinkTable'}">
					<li ><a href="#tab1" id="typeClick">类型名称</a></li> 
				    <li ><a href="#tab2" class="selected" id="tableClick">类型数据</a></li> 
				</c:if>
				<c:if test="${botPopLink=='botFourLinkType'}">
				    <li ><a href="#tab1" class="selected" id="typeClick">类型名称</a></li> 
				    <li ><a href="#tab2"  id="tableClick">类型数据</a></li> 
				</c:if>
			  	</ul>
		    </div> 
		    
		  	<div id="tab1" class="tabson">
		         <div class="rightinfo">
			    <div class="tools">
			    	<ul class="toolbar">
				        <li class="click" onclick="window.top.addFourData();">
					        <span>
					        	<img src="${pageContext.request.contextPath}/images/baImages/t01.png" />
					        </span>添加
				        </li>
				        <li onclick="delectAll('type','showTable','');">
					        <span>
					        	<img src="${pageContext.request.contextPath}/images/baImages/t03.png" />
					        </span>删除
				        </li>
			        </ul>
			    </div>
			    <table class="tablelist" id="typeNameEdit">
			    	<thead>
				    	<tr>
					        <th style="width:3%"><input id="checkeds" name="" type="checkbox" value="" /></th>
					        <th style="width:15%">类型编码<i class="sort"><img src="${pageContext.request.contextPath}/images/baImages/px.gif" /></i></th>
					        <th style="width:15%">名称</th>
					        <th style="width:15%">排序</th>
					        <th style="width:15%">是否审核</th>
					        <th style="width:15%">操作</th>
				        </tr>
			        </thead>
			        <tbody id="showTable">
			        <c:forEach items="${Tydatas}" var="brand">
				        <tr>
				        <td style="display: none;"><input id="hiddenTypeId" name="" type="hidden"value="${brand.id}" /></td>
				        <td><input name="" type="checkbox" value="${brand.id}" /></td>
				        <td class="tab" id="linktypeid" value="linkType">${brand.linkType}</td>
				        <td class="tab" value="linkTypename">${brand.linkTypename}</td>
				        <td class="tab" value="remarks1">${brand.remarks1}</td>
				        <td >已审核</td>
				        <td><a href="#" class="tablelink"  onclick="delectOne('${brand.id}','${brand.linkType}','type')"> 删除</a></td>
				        </tr> 
			        </c:forEach>
			        </tbody>
			    </table>
			    
			   
					 <div class="pagin">
						<div class="message">
							共<i class="blue">${TyrowCount}</i>条记录，总页数<i class="blue">${TypageCount}</i>，当前显示第&nbsp;<i
								class="blue">${TycurrentPage}&nbsp;</i>页
						</div>
						<ul class="paginList">
							<li class="paginItem"><a
								href="<c:url value='/baSkip/botFourLink/botFourLinkType.do?type=3&currentPageNumber=1'/>">首页</a></li>
							<li class="paginItem">
							   <c:if test="${TycurrentPage!=1}">
									<a
										href="<c:url value='/baSkip/botFourLink/botFourLinkType.do?type=3&currentPageNumber=${TycurrentPage-1}'/>">
										<span class="pagepre"></span>
									</a>
								</c:if></li>
							<c:forEach begin="${TyshowStart}" end="${TyshowEnd}" var="page">
								<c:if test="${TycurrentPage==page}" var="boo">
									<li class="paginItem"><a href="javascript:;">${page}</a></li>
								</c:if>
								<c:if test="${!boo}">
									<li class="paginItem"><a
										href="<c:url value='/baSkip/botFourLink/botFourLinkType.do?type=3&currentPageNumber=${page}'/>">
											${page} </a></li>
								</c:if>
							</c:forEach>
							<li class="paginItem"><c:if test="${TycurrentPage!=TypageCount}">
									<a
										href="<c:url value='/baSkip/botFourLink/botFourLinkType.do?type=3&currentPageNumber=${TycurrentPage+1}'/>">
										<span class="pagenxt"></span>
									</a>
								</c:if></li>
							<li class="paginItem"><a
								href="<c:url value='/baSkip/botFourLink/botFourLinkType.do?type=3&currentPageNumber=${TypageCount}'/>">尾页</a>
							</li>
						</ul>
					</div>
			    </div>
		    </div> 
		    
		    
		    
		    
		    
		  	<div id="tab2" class="tabson">
		  	      <div class="rightinfo">
			    <div class="tools">
			    	<ul class="toolbar">
				        <li class="click" onclick="window.top.addFourTabData('${selectType}','${selectTypeId}');">
					        <span>
					        	<img src="${pageContext.request.contextPath}/images/baImages/t01.png" />
					        </span>添加
				        </li>
				        <li onclick="delectAll('table','showTableTwo','${selectTypeId}');">
					        <span>
					        	<img src="${pageContext.request.contextPath}/images/baImages/t03.png" />
					        </span>删除
				        </li>
				        
			        </ul>
			        <ul class="toolbar" style="float:right">
			          <li onclick="creatFtl('${selectTypeId}');">
					        <span>
					        	<img src="${pageContext.request.contextPath}/images/baImages/t01.png" />
					        </span>生成模板页面
				        </li>
			        </ul>
			        <ul class="toolbar1" style="margin-right:50%;">
						<li class="selectList" >
							<span>选择类型名称
							<input name="${selectType}" type="hidden" value="${selectName}" />
								<select name="type"id="tableSelect" onchange="gradeChange()"
										style="width:150px; font-size: 12px; border:1px solid #3994c7; text-indent: 0; background: #f2f2f2;position: relative;height:23px;">
											
											<c:forEach items="${selectAllty}" var="brand">
												<c:if test="${selectType == brand.linkType}">
												    <option class="selects"  value="${brand.id}" selected="selected">${selectName}</option>
												</c:if>
												<c:if test="${selectType != brand.linkType}">
												     <option class="selects"  value="${brand.id}">${brand.linkTypename}</option>
												</c:if>
											       
									        </c:forEach>
								 </select>
							</span> 
						</li>
					</ul>
			    </div>
			    <form id="addFourTabFrom" method="post" enctype="multipart/form-data">
			    <table class="tablelist" id="tableNameEdit">
			    	<thead>
			    	<tr style="width:3%">
			        <th><input id="checkedTwo" name="" type="checkbox" value="" /></th>
			        <th style="width:8%">类型编码<i class="sort"><img src="${pageContext.request.contextPath}/images/baImages/px.gif" /></i></th>
			        <th style="width:27%">略缩图</th>
			        <th style="width:10%">名称</th>
			        <th style="width:15%">图片地址</th>
			        <th style="width:15%">网站地址</th>
			        <th style="width:7%">是否审核</th>
			        <th style="width:5%">排序</th>
			        <th style="width:10%">操作</th>
			        </tr>
			        </thead>
			        <tbody id="showTableTwo">
			        <c:forEach items="${Tadatas}" var="brand"  varStatus="status">
				        <tr>
				        <td style="display: none;"><input name="" id="hiddenTableId" type="hidden"value="${brand.id}" /></td>
				        <td><input name="" type="checkbox" value="${brand.id}" /></td>
				        <td class="typecss" id="linktypename" value="linktypename">${brand.linktypename}</td>
				        <td class="typecss" value="picAddr">
					        <div>
						        <img id="updaddress" style="width: 80px; height:60px;margin: 5px 10px 5px 0;" src="${baUrl}/other${brand.skipAddress}"/>
						        <input name="addimgsFour${status.count}" type="file" onchange="submitFourUpload('${brand.id}','addimgsFour${status.count}')" style="position: absolute; margin-top: 40px;" />
					       </div>
                        </td>
				        <td class="tab" value="linkName">${brand.linkName}</td>
				        <td class="typecss" value="skipAddress">${brand.skipAddress}</td>
				        <td class="tab" value="linkAddress">${brand.linkAddress}</td>
				        <td>已审核</td>
				        <td class="tab" value="linkSort">${brand.linkSort}</td>
				        <td><a href="#" class="tablelink" onclick="delectOne('${brand.id}','${brand.linktypeid}','table')"> 删除</a></td>
				        </tr> 
			        </c:forEach>
			       

			        </tbody>
			    </table>
			    </form>
			          <div class="pagin">
						<div class="message">
							共<i class="blue">${TarowCount}</i>条记录，总页数<i class="blue">${TapageCount}</i>，当前显示第&nbsp;<i
								class="blue">${TacurrentPage}&nbsp;</i>页
						</div>
						<ul class="paginList">
							<li class="paginItem"><a
								href="<c:url value='/baSkip/botFourLink/botFourLinkTable.do?type=3&typeData=${selectTypeId}&currentPageNumber=1'/>">首页</a></li>
							<li class="paginItem">
							   <c:if test="${TacurrentPage!=1}">
									<a
										href="<c:url value='/baSkip/botFourLink/botFourLinkTable.do?type=3&typeData=${selectTypeId}&currentPageNumber=${TacurrentPage-1}'/>">
										<span class="pagepre"></span>
									</a>
								</c:if></li>
							<c:forEach begin="${TashowStart}" end="${TashowEnd}" var="page">
								<c:if test="${TacurrentPage==page}" var="boo">
									<li class="paginItem"><a href="javascript:;">${page}</a></li>
								</c:if>
								<c:if test="${!boo}">
									<li class="paginItem"><a
										href="<c:url value='/baSkip/botFourLink/botFourLinkTable.do?type=3&typeData=${selectTypeId}&currentPageNumber=${page}'/>">
											${page} </a></li>
								</c:if>
							</c:forEach>
							<li class="paginItem"><c:if test="${TacurrentPage!=TapageCount}">
									<a
										href="<c:url value='/baSkip/botFourLink/botFourLinkTable.do?type=3&typeData=${selectTypeId}&currentPageNumber=${TacurrentPage+1}'/>">
										<span class="pagenxt"></span>
									</a>
								</c:if></li>
							<li class="paginItem"><a
								href="<c:url value='/baSkip/botFourLink/botFourLinkTable.do?type=3&typeData=${selectTypeId}&currentPageNumber=${TapageCount}'/>">尾页</a>
							</li>
						</ul>
					</div>
			    </div>
		    </div>  
		</div> 
		<script type="text/javascript"> 
	      $("#usual1 ul").idTabs(); 
	    </script>
	    <script type="text/javascript">
		$('.tablelist tbody tr:odd').addClass('odd');
		</script>
    </div>
    <!--遮罩和加载  -->
		<div id="bg"></div>
		<div class="box" style="display:none">
		   <div id="shclDefault"></div>
		</div>
</body>
</html>
